<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta charset="UTF-8">
		<title>后台待发信息</title>
		<link rel="stylesheet" href="../layui/css/layui.css" />
		<style type="text/css">
			.waitsendfrontinfo-con {
				padding: 10px 15px 15px 15px;
			}
			
			.not_border_left {
				border-left: none !important;
			}
			
			.layui-table-body table tbody .layui-table-hover {
				background: #fffdd3 !important;
			}
			
			.layui-table-body table tbody .layui-table-click {
				background: #fdef9b !important;
			}
			
			.layui-table-view {
				border: none;
			}
			
			.layui-table-tool-self {
				display: none;
			}
			
			.thumbBox {
				height: 131px;
				overflow: hidden;
				border: 1px solid #e6e6e6;
				border-radius: 2px;
				cursor: pointer;
				position: relative;
				text-align: center;
				line-height: 133px;
				margin-bottom: 10px;
				background-color: white;
			}
			
			.waitsendfrontinfo-con .thumbImg {
				max-width: 100%;
				max-height: 100%;
				border: none;
			}
			
			.thumbBox::after {
				position: absolute;
				width: 100%;
				height: 100%;
				line-height: 133px;
				z-index: 0;
				text-align: center;
				font-size: 20px;
				left: 0px;
				top: 0px;
				color: rgb(159, 159, 159);
			}
			
			.addInfoImg,
			.layer-editfrontinfo {
				display: none;
				padding: 5px 10px;
			}
			
			.addInfoImg .layui-table-cell {
				height: auto !important;
			}
		</style>
	</head>

	<body>
		<!-- 弹窗调用内容开始 -->
		<div class="addInfoImg" id="addInfoImg" style="display:none">
			<table class="layui-hide" id="selImg" lay-filter="selImg"></table>
			<script type="text/html" id="toolbarDemo">
				<div class="layui-btn-container">
					<button class="layui-btn" lay-event="getCheckData">保存</button>
				</div>
			</script>
		</div>
		<!-- 弹窗调用内容结束 -->

		<div class="waitsendfrontinfo-con">
			<!--待发信息修改弹窗Start-->
			<div class="layer-editfrontinfo" id="layereditfrontinfo">
				<form class="layui-form layui-row wrap">
					<div class="layui-col-md11">
						<div class="layui-row layui-col-space20">
							<div class="layui-col-md9 layui-col-xs7">
								<div class="layui-form-item" style="margin-bottom:30px">
									<label class="layui-form-label">文章标题</label>
									<div class="layui-input-block">
										<input id="layerinfoid" type="text" class="layui-input" style="display:none">
										<input id="infotitle" type="text" class="layui-input newsName" lay-verify="newsName" placeholder="请输入文章标题">
									</div>
								</div>
								<div class="layui-form-item">
									<label class="layui-form-label">文章内容</label>
									<div class="layui-input-block">
										<textarea class="layui-textarea layui-hide" name="content" lay-verify="content" id="news_content"></textarea>
									</div>
								</div>
							</div>
							<div class="layui-col-md3 layui-col-xs5" style="text-align: center;">
								<div class="layui-form-item">
									<div class="layui-upload-list thumbBox thumbBox2" id="imgchangeimg">
										<img class="layui-upload-img thumbImg">
										<input id="inpphotoid" type="text" style="display:none" />
									</div>
								</div>
								<div class="layui-form-item">
									<fieldset class="layui-elem-field">
										<legend style="font-size: 16px;"><strong>信息类型</strong></legend>
										<div class="layui-form-item layui-field-box" id="divridioinfotype" style="max-height:130px;overflow: auto;">
										</div>
									</fieldset>
								</div>
								<div class="layui-form-item">
									<fieldset class="layui-elem-field">
										<legend style="font-size: 16px;"><strong>是否是热点文章</strong></legend>
										<div class="layui-form-item layui-field-box" id="ridioclassifys" style="max-height:130px;overflow: auto;">
											<input id="ishottopi" type="checkbox" name="ishottopi" lay-filter="ishottopi" lay-skin="switch" lay-text="是|不是">
										</div>
									</fieldset>
								</div>
								<div class="layui-form-item">
									<button id="btnsendinfo" type="button" class="layui-btn" style="float:right">发送</button>
									<button id="btnsaveinfo" type="button" class="layui-btn" style="float:right;margin-right:10px">保存</button>
								</div>
							</div>
						</div>
					</div>
				</form>
			</div>
			<!-- 待发信息修改弹窗end-->

			<!-- 条件查询区Start -->
			<blockquote class="layui-elem-quote not_border_left">
				<div class="layui-inline">
					<div class="layui-input-inline">
						<input id="inpfrontinfotitle" name="inpfrontinfotitle" type="text" autocomplete="off" placeholder="请输入信息标题" class="layui-input">
					</div>
					<div class="layui-inline">
						<button id="btnselfrontinfo" type="button" class="layui-btn layui-bg-blue">查询</button>
					</div>
				</div>
			</blockquote>
			<!-- 条件查询区End -->

			<table class="layui-hide" id="tabwaitsendfrontinfo" lay-filter="tabwaitsendfrontinfo"></table>

			<script type="text/html" id="barDemo">
				<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="btnselwaitsendinfo">查看</a>
				<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="btnsendwaitsendinfo">发送</a>
				<a class="layui-btn layui-btn-xs layui-bg-red" lay-event="btndelwaitsendinfo">删除</a>
			</script>

			<script type="text/html" id="powerbar">
				<span> {{ d.ishotarticle==true ? '是'  : '不是'}}</span>
			</script>

		</div>
		<script src="../js/jquery-3.3.1.js"></script>
		<script src="../layui/layui.all.js"></script>
		<script type="text/javascript">
			layui.use(['table', 'layedit', 'upload', 'form'], function() {
				var upload = layui.upload;
				var form = layui.form;
				var layedit = layui.layedit;
				var table = layui.table;

				var ishospito = 0;

				//创建文本编辑器
				var editIndex = layedit.build('news_content', {
					tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right', 'link', 'unlink', 'face'],
					height: 350
				});

				/* 页面加载时加载表格 */
				table.render({
					elem: '#tabwaitsendfrontinfo',
					id: 'frontinfoid',
					url: '../informationmanagement/getwaitsendfrontinfo',
					title: '后台待发信息表',
					height: "full-125",
					skin: 'line',
					even: true,
					cols: [
						[{
								type: 'numbers',
								title: '序号',
								align: "center"
							},
							{
								field: 'title',
								title: '标题',
								align: "center"
							}, {
								field: 'typename',
								title: '信息类型',
								align: "center"
							}, {
								field: 'author',
								title: '发布人',
								align: "center"
							}, {
								field: 'ishotarticle',
								title: '是否是热点文章',
								templet: '#powerbar',
								align: "center"
							},
							{
								field: 'createtime',
								title: '创建时间',
								align: "center"
							}, {
								title: '操作',
								toolbar: '#barDemo',
								align: "center"
							}
						]
					],
					page: {
						layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
						groups: 5,
						limit: 10,
						theme: '#1E9FFF',
					}
				});

				/* 点击查询对信息进行筛选 */
				$("#btnselfrontinfo").click(function() {
					var title = $("#inpfrontinfotitle").val();
					table.render({
						elem: '#tabwaitsendfrontinfo',
						id: 'frontinfoid',
						url: '../informationmanagement/getwaitsendfrontinfo?title=' + title,
						title: '后台待发信息表',
						height: "full-125",
						skin: 'line',
						even: true,
						cols: [
							[{
									type: 'numbers',
									title: '序号',
									align: "center"
								},
								{
									field: 'title',
									title: '标题',
									align: "center"
								}, {
									field: 'typename',
									title: '信息类型',
									align: "center"
								}, {
									field: 'author',
									title: '发布人',
									align: "center"
								}, {
									field: 'ishotarticle',
									title: '是否是热点文章',
									templet: '#powerbar',
									align: "center"
								}, {
									field: 'createtime',
									title: '创建时间',
									align: "center"
								}, {
									title: '操作',
									toolbar: '#barDemo',
									align: "center"
								}
							]
						],
						page: {
							layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
							groups: 5,
							limit: 10,
							theme: '#1E9FFF',
						}
					});
				});

				/* 工具栏事件 */
				table.on('tool(tabwaitsendfrontinfo)', function(obj) {
					var data = obj.data;
					/* 待发信息查看修改 */
					if(obj.event === 'btnselwaitsendinfo') {
						$("#layerinfoid").val(data.infoid);
						$("#infotitle").val(data.title);
						layedit.setContent(editIndex, data.infocontent, false);
						$("#inpphotoid").val(data.photoid);
						$(".thumbImg").attr("src", "/kmsximgs/photo/" + data.path);
						/* 加载文章类型 */
						$("#divridioinfotype").html("");
						$.ajax({
							url: '../informationmanagement/getallinfotype',
							type: 'get',
							dataType: 'json',
							success: function(getdata) {
								if(getdata.code == 0) {
									var str = "";
									for(var i = 0; i < getdata.count; i++) {
										if(getdata.data[i].typeid == data.typeid) {
											str += "<input type='radio' name='infotype' value='" + getdata.data[i].typeid + "' title='" + getdata.data[i].typename + "' checked>";
										} else {
											str += "<input type='radio' name='infotype' value='" + getdata.data[i].typeid + "' title='" + getdata.data[i].typename + "'>";
										}
									}
									$("#divridioinfotype").append(str);
									form.render("radio");
								} else {}
							},
							error: function() {}
						});
						if(data.ishotarticle == true) {
							ishospito = 1;
							$("#ishottopi").attr("checked", true);
							form.render();
						} else {
							ishospito = 0;
							$("#ishottopi").attr("checked", false);
							form.render();
							
						}
						var index = layer.open({
							type: 1,
							title: '待发信息修改',
							area: ['600px', '80%'],
							shade: 0.8,
							maxmin: true,
							content: $('#layereditfrontinfo'),
							cancel: function() {
								$(".layer-editfrontinfo").css("display", "none");
							}
						});
						layer.full(index);

						/* 选择图片弹窗 */
						$("#imgchangeimg").click(function() {
							var indeximg = layer.open({
								type: 1,
								title: '选择文章封面图片',
								area: ['600px', '80%'],
								shade: 0.8,
								content: $('#addInfoImg'),
								cancel: function() {
									$(".addInfoImg").css("display", "none");
								}
							});

							//选择图片点击保存
							table.on('toolbar(selImg)', function(obj) {
								var checkStatus = table.checkStatus(obj.config.id);
								switch(obj.event) {
									case 'getCheckData':
										var data = checkStatus.data;
										$("#inpphotoid").val(data[0].photoid);
										$(".thumbImg").attr("src", "/kmsximgs/photo/" + data[0].path);
										$("#imgchangeimg").removeClass("thumbBox2");
										layer.close(indeximg);
										$(".addInfoImg").css("display", "none");
										break;
								};
							});
						});

					}
					/* 待发信息发送 */
					else if(obj.event === 'btnsendwaitsendinfo') {
						layer.confirm('确定要发送么？', {
							btn: ['确定', '取消'],
							icon:3
						},function() {
							$.ajax({
								type: 'get',
								url: "../informationmanagement/sendwaitsendfrontinfo?infoid=" + data.infoid,
								dataType: 'json',
								success: function(data) {
									if(data.code == 10001) {
										layer.alert(data.msg, {
											btn: ['知道了']
										}, function() {
											table.reload("frontinfoid", {
												where: {
													keyword: data.code == '10001'
												}
											});
											layer.closeAll();
										});
									} else {
										layer.alert(data.msg, 2);
									}
								},
								error: function() {
									layer.msg("发生未知错误！！！");
								},
							});
						}, function() {});
					}
					/*待发信息删除*/
					else if(obj.event === 'btndelwaitsendinfo') {
						layer.confirm('确定要删除么？', {
							btn: ['确定', '取消'],
							icon:3
						}, function() {
							$.ajax({
								type: 'get',
								url: "../informationmanagement/delwaitsendfrontinfo?infoid=" + data.infoid,
								dataType: 'json',
								success: function(data) {
									if(data.code == 10001) {
										layer.alert(data.msg, {
											btn: ['知道了']
										}, function() {
											table.reload("frontinfoid", {
												where: {
													keyword: data.code == '10001'
												}
											});
											layer.closeAll();
										});
									} else {
										layer.alert(data.msg, 2);
									}
								},
								error: function() {
									layer.msg("发生未知错误！！！");
								},
							});
						}, function() {});
					}
				});

				/* 选择图片弹窗表格 */
				table.render({
					elem: '#selImg',
					url: '../sysimgmanagement/getinforimagelist',
					toolbar: '#toolbarDemo',
					cols: [
						[{
							type: 'radio'
						}, {
							field: 'src',
							title: '',
							unresize: true,
							align: 'center',
							sort: false,
							style: 'height:100%; width:100%;',
							templet: function(d) {
								return '<div class="layer-photos-demo" style="cursor:pointer;"><img src="/kmsximgs/photo/' + d.path + '"></div>';
							}
						}]
					],
					done: function(res, curr, count) { //表格数据加载完后的事件
						layer.photos({ //点击图片弹出
							photos: '.layer-photos-demo',
							anim: 1 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
						});
					}
				});

				//开关按钮（是否是热点文章）
				form.on('switch(ishottopi)', function(data) {
					if(data.elem.checked) {
						ishospito = 1;
					} else {
						ishospito = 0;
					}
				});
				/*保存待发信息*/
				$("#btnsaveinfo").click(function() {
					var infoid = $("#layerinfoid").val();
					var title = $("#infotitle").val().trim();
					var content = layedit.getContent(editIndex);
					var photoid = $("#inpphotoid").val().trim();
					var infotype = $("input[name='infotype']:checked").val();

					if(title == null || title == "" || title == undefined) {
						layer.msg("添加信息标题不能为空");
						return;
					}
					if(content == null || content == "" || content == undefined) {
						layer.msg("添加信息内容不能为空");
						return;
					}
					if(photoid == null || photoid == "" || photoid == undefined) {
						layer.msg("请选择文章图片");
						return;
					}
					if(infotype == null || infotype == "" || infotype == undefined) {
						layer.msg("请选择信息类型");
						return;
					}
					$.ajax({
						url: '../informationmanagement/savewaitsendfrontinfo',
						type: 'get',
						dataType: 'json',
						data: {
							title: title,
							content: content,
							photoid: photoid,
							infotype: infotype,
							ishottopic: ishospito,
							infoid: infoid
						},
						success: function(data) {
							if(data.code == 10001) {
								layer.alert(data.msg, {
									btn: ['知道了'],
									icon:1
								}, function() {
									layer.closeAll();
									$(".layer-editfrontinfo").css("display", "none");
									table.reload("frontinfoid", {
										where: {
											keyword: data.code == '10001'
										}
									});
								});
							} else {
								layer.alert(data.msg, {icon: 2});
							}
						}
					});
				});

				/*发送信息*/
				$("#btnsendinfo").click(function() {
					var infoid = $("#layerinfoid").val();
					var title = $("#infotitle").val().trim();
					var content = layedit.getContent(editIndex);
					var photoid = $("#inpphotoid").val().trim();
					var infotype = $("input[name='infotype']:checked").val();

					if(title == null || title == "" || title == undefined) {
						layer.msg("添加信息标题不能为空");
						return;
					}
					if(content == null || content == "" || content == undefined) {
						layer.msg("添加信息内容不能为空");
						return;
					}
					if(photoid == null || photoid == "" || photoid == undefined) {
						layer.msg("请选择文章图片");
						return;
					}
					if(infotype == null || infotype == "" || infotype == undefined) {
						layer.msg("请选择信息类型");
						return;
					}
					$.ajax({
						url: '../informationmanagement/sendsavewaitsendfrontinfo',
						type: 'get',
						dataType: 'json',
						data: {
							title: title,
							content: content,
							photoid: photoid,
							infotype: infotype,
							ishottopic: ishospito,
							infoid: infoid
						},
						success: function(data) {
							if(data.code == 10001) {
								layer.alert(data.msg, {
									btn: ['知道了'],
									icon:1
								}, function() {
									layer.closeAll();
									$(".layer-editfrontinfo").css("display", "none");
									table.reload("frontinfoid", {
										where: {
											keyword: data.code == '10001'
										}
									});
								});
							} else {
								layer.alert(data.msg, {icon: 2});
							}
						}
					});
				});
			});
		</script>
	</body>

</html>